<template>
  <div id="app">
    <p style="color:red"><b> {{ name }}</b></p>
    <p><b>Let's start your performance now~</b></p>
    <el-input v-model="getRow()" autosize type="textarea"/>
  </div>
</template>

<style scoped>

</style>

<script>
module.exports = {
  name: "demo-code",
  data() {
    return {
      name: 'BIC-Business inspection chart MVP Version'
    };
  },
  methods: {
    // This method should not be overwritten or modified, it is a value logic
    getRow() {
      let vm = this
      let pluginContext = vm.getPluginContext()
      return JSON.stringify(pluginContext, null, '\t')
    },
    // This method should not be overwritten or modified, it is a value logic
    getPluginContext() {
      let vm = this
      while (vm.$parent && !vm.$parent.pluginContext) {
        vm = vm.$parent
      }
      if (!vm.$parent || !vm.$parent.pluginContext) {
        return {}
      }

      if (Object.prototype.toString.call(vm.$parent.pluginContext) === '[object String]') {
        return JSON.parse(vm.$parent.pluginContext)
      }
      return vm.$parent.pluginContext
    }
  }
}
</script>